/**
 * json配置举例，更多配置请看 IConfigSchema
 * @author luguoxiang
 * @date 2022/7/5
 * 开源项目：https://gitee.com/lgx1992/lg-soar 求star！请给我star！请帮我点个star！
 */
import {
  IConfigSchema,
  LgBizSelect,
  LgBizSelectProps,
  LgBizTree,
  LgBizTreeProps,
  LgDictProps,
  LgIcon,
  LgText,
  LgTextProps,
} from '@/soar';
import api, { basePath } from './api';
import permitApi, { basePath as permitBasePath } from '../permit/api';
import IconPicker from '@/components/IconPicker/index.vue';
import { MenuComponent } from '@/types/interface';
// 获取全部图标的列表

const TYPES = {
  0: [3, 2, 1],
  1: [3, 2],
  2: [3, 2],
  3: [3],
};

const fieldList: IConfigSchema<any>[] = [
  {
    field: 'type',
    label: '类型',
    dataType: 'dict',
    params: 'MenuTypeEnum',
    table: {
      width: 80,
      sorter: true,
    },
    form: {
      rules: true,
      componentProps: {
        component: 't-radio-group',
      },
    },
  },
  {
    field: 'parentId',
    label: '所属父级',
    dataType: 'string',
    table: false,
    search: false,
    form: {
      rules: true,
      vif({ data }): boolean {
        return data.type !== 3;
      },
      component: LgBizTree,
      componentProps({ data }) {
        return {
          fields: 'id,title,parentId',
          filters: [`type-in~${TYPES[data.type]?.join('~') ?? 3}`],
          data: api.query,
          prepend: { value: '0', label: '根节点' },
        } as LgBizTreeProps;
      },
    },
    detail: {
      valueProp: 'modelValue',
      component: LgText,
      componentProps: {
        api: api.query,
        labelField: 'title',
      } as LgTextProps,
    },
  },
  {
    field: 'title',
    label: '名称',
    dataType: 'string',
    form: {
      rules: true,
    },
    table: {
      order: -1,
    },
  },
  {
    field: 'component',
    label: '组件',
    dataType: 'string',
    form: {
      rules({ data }) {
        if (data.type === 1) {
          return [{ required: true, message: '组件必填' }];
        }
        return [{ required: false }];
      },
      slots: 'component',
      vif({ data }) {
        return data.type === 1 || data.type === 2;
      },
    },
    table: {
      ellipsis: true,
    },
    detail: {
      vif({ data }) {
        return data.type === 1 || data.type === 2;
      },
    },
  },
  {
    field: 'path',
    label: '路径',
    dataType: 'string',
    form: {
      rules: true,
      vif({ data }) {
        return data.type !== 0;
      },
      slots: 'path',
    },
    table: {
      ellipsis: true,
    },
    detail: {
      vif({ data }) {
        return data.type !== 0;
      },
    },
  },
  {
    field: 'code',
    label: '权限码',
    dataType: 'string',
    form: {
      rules({ data }) {
        return [{ required: data.type === 0, message: '权限码必填' }];
      },
      componentProps({ data }) {
        return {
          placeholder: data?.path || '编码（路由名称）',
        };
      },
    },
    table: {
      ellipsis: true,
    },
  },
  {
    field: 'icon',
    label: '图标',
    dataType: 'string',
    search: false,
    table: {
      width: 70,
      align: 'center',
      cell: (h, { row }) => h(LgIcon, { value: row.icon }),
    },
    detail: {
      component: 't-icon',
      valueProp: 'name',
      vif({ data }): boolean {
        return data.type !== 0;
      },
    },
    form: {
      vif({ data }): boolean {
        return data.type !== 0;
      },
      component: IconPicker,
    },
  },
  {
    field: 'redirect',
    label: '重定向路径',
    dataType: 'string',
    form: {
      vif({ data }) {
        return data.type === 2 || data.type === 3;
      },
    },
    table: {
      ellipsis: true,
    },
    detail: {
      vif({ data }) {
        return data.type === 2 || data.type === 3;
      },
    },
  },
  {
    field: 'sort',
    label: '排序',
    dataType: 'number',
    table: {
      width: 120,
      slots: 'sort',
      sorter: true,
    },
    form: {
      vif({ data }): boolean {
        return data.type !== 0;
      },
    },
    detail: {
      vif({ data }): boolean {
        return data.type !== 0;
      },
    },
  },
  {
    field: 'status',
    label: '状态',
    dataType: 'dict',
    params: 'MenuStatusEnum',
    form: {
      rules: true,
      componentProps: {
        component: 't-radio-group',
      } as LgDictProps,
    },
    table: {
      width: 80,
    },
  },
  {
    field: 'hideChildren',
    label: '隐藏子菜单',
    dataType: 'boolean',
    form: {
      vif({ data }) {
        return data.type === 2;
      },
    },
    detail: {
      vif({ data }) {
        return data.type === 2;
      },
    },
    table: false,
  },
  {
    field: 'keepalive',
    label: '是否缓存',
    dataType: 'boolean',
    form: {
      vif({ data }) {
        return data.type === 1;
      },
    },
    detail: {
      vif({ data }) {
        return data.type === 1;
      },
    },
    table: {
      width: 80,
      align: 'center',
      slots: 'keepalive',
    },
  },
  {
    field: 'shared',
    label: '是否共享页签',
    dataType: 'boolean',
    form: {
      vif({ data }) {
        return data.type === 1;
      },
    },
    detail: {
      vif({ data }) {
        return data.type === 1;
      },
    },
    table: false,
  },
  {
    field: 'permitIds',
    label: '接口权限',
    dataType: 'string',
    form: {
      vif({ data }) {
        return data.type === 0 || data.type === 1;
      },
      colProps: {
        style: '--lg-grid-min: 2;--lg-grid-max: 2',
      },
      component: LgBizSelect,
      componentProps: {
        data: permitApi.query,
        multiple: true,
        fields: 'id,name,code',
        search: true,
        labelField: '【${name}】${code}',
      } as LgBizSelectProps,
    },
    detail: {
      valueProp: 'modelValue',
      component: LgText,
      componentProps: {
        api: permitApi.query,
      } as LgTextProps,
      vif({ data }) {
        return data.type === 0 || data.type === 1;
      },
    },
    table: false,
  },
];

export default fieldList;

/**
 * 组件配置（用于生成菜单数据）
 */
export const COMPONENTS: MenuComponent[] = [
  {
    title: '菜单管理',
    component: () => import('./List.vue'),
    sort: 50,
    keepalive: true,
    icon: 'bulletpoint',
    permits: [`GET${basePath}/query`],
    elements: [
      { title: '新增', code: 'create', permits: [`POST${basePath}/create`, `GET${permitBasePath}/query`] },
      {
        title: '更新',
        code: 'update',
        permits: [`POST${basePath}/update`, `GET${permitBasePath}/query`, `GET${basePath}/detail`],
      },
      { title: '删除', code: 'remove', permits: [`POST${basePath}/remove`] },
      { title: '详情', code: 'detail', permits: [`GET${basePath}/detail`] },
      { title: '导入', code: 'import', permits: [`POST${basePath}/import`] },
      { title: '导出', code: 'export', permits: [`GET${basePath}/export`] },
      { title: '清除缓存', code: 'clear-cache', permits: [`POST${basePath}/clear-cache`] },
      { title: '批量新增', code: 'batchCreate', permits: [`POST${basePath}/batchCreate`] },
    ],
  },
];
